<template>
    <div class="detailWrap">
            <van-nav-bar
        title="易车"
        left-text="返回"
        left-arrow
        />
        <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
            <div v-for="(v,i) in detailData.img" :key='i'>
                <van-swipe-item><img :src="v" alt=""></van-swipe-item>
            </div>
        </van-swipe>
        <div class="desc">
            <h3>{{detailData.title}}</h3>
            <p>{{detailData.desc}}</p>
            <p class="price">￥{{detailData.price}}万</p>
        </div>

        <van-goods-action>
        <van-goods-action-icon icon="chat-o" text="客服" />
        <van-goods-action-icon icon="cart-o" text="购物车" />
        <van-goods-action-icon icon="shop-o" text="店铺" />
        <van-goods-action-button
            type="danger"
            text="立即购买"
        />
        </van-goods-action>
    </div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
@Component
export default class Home extends Vue{
    private detailData:any=this.$route.query
}
</script>

<style lang="scss" scoped>
    .detailWrap{
        width: 100%;
        .my-swipe{
            width: 100%;
            img{
                width: 100%;
            }
        }
    }
    .desc{
        width: 100%;
        padding: 10px 20px;
    }
    .price{
        font-size: 20px;
        font-weight: bold;
        color: red;
    }
</style>